import React, { useReducer } from 'react'

const defaultValue = {
  count: 0
}

const reducer = (state, action) => {
  if (action.type === 'add') {
    return {
      count: state.count + 1
    }
  }

  return state
}

const handleClick = (dispatch) => {
  return () => {
    dispatch({
      type: 'add'
    })
  }
}

export default function UseReducerDemo() {
  const [ state, dispatch ] = useReducer(reducer, defaultValue)

  return (
    <>
      <div>{state.count}</div>
      <button onClick={handleClick(dispatch)}>add</button>
    </>
  )
}
